﻿@using HelloMinasan.Resources
@using HelloMinasan.Framework.Web.WebHelpers
@using HelloMinasan.Framework.Helpers
@using HelloMinasan.Cdn
@model HelloMinasan.Web.Song.ViewModels.WrapCommentModels

@Html.HiddenFor(x => x.SongId)
<script src="@Url.Content("~/Scripts/jquery.min.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.autosize.min.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.msgbox.min.js")"></script>
<script>
    $(document).ready(function () {
        $(".contentItemComments").autosize();
    });
</script>
<script src="@Url.Content("~/Content/Js/Comments.js")"></script>
@foreach (var item in Model.Comments)
{
    bool isOwner = Request.IsAuthenticated && item.User.Id == int.Parse(User.Identity.Name) ? true : false;
    
    <div class='commentDivContainer'>
        <a href="/Account/UserInformation/@item.User.Username">
            @*<img class='smallAvatarComment' src="@item.User.Avatar" title="@item.User.DisplayName - @item.User.Username"/>*@
            @Html.Avatar(item.Id, item.User.HasAvatar, AvatarSize.SmallSearch, new { alt = item.User.DisplayName })
        </a>
        <div class='contentComment'>
            <div><strong>Date: @item.PostedDate</strong></div>
            <div class="commentItemContent" id="commentItemContent-@item.Id">
                @if (isOwner)
                {
                    <textarea id="commentContent-@item.Id" class="contentItemComments">@item.CommentContent</textarea>
                    <span class="iconSave">
                        <img onclick="editComment(@item.Id)" src="/Content/Images/save.png" /></span>
                    if (Model.JustPerformBadWordItem && item.Id == Model.Comments.First().Id)
                    {
                    <div class="validateMessage">@Resource.Song_BadWordsDetected</div>
                    }
                }
                else
                {
                    <textarea class="contentItemComments" disabled="disabled">@item.CommentContent</textarea>
                    if (Request.IsAuthenticated)
                    { 
                    <span style="font-weight:bold; cursor:pointer" onclick="reportComment(@item.Id)">
                        <img src="/Content/Images/text.png" width="20" />
                        <text>Report this somment</text>
                    </span>
                    }
                }
                <div class="validateMessage" id="messageId-@item.Id"></div>
            </div>
        </div>
    </div>
}
<div align="left" style="margin-top: 10px;">
    @if (@Model.PagingControl.PreviousPageNumber > 0)
    {
        <a onclick="gotoCommentPage(@Model.SongId, 1)" class="buttonClass">First</a>
        <a onclick="gotoCommentPage(@Model.SongId, @Model.PagingControl.PreviousPageNumber)" class="buttonClass">Back</a>
    }
    <select onchange="jumpToPage(this, @Model.SongId)">
        @for (int i = 1; i <= Model.TotalPageCount; i++)
        {
            if (i != Model.PagingControl.CurrentPageNumber)
            { <option value="@i">@i</option> }
            else
            { <option value="@i" selected>@i</option> }
        }
    </select>
    @if (@Model.PagingControl.NextPageNumber <= Model.TotalPageCount)
    {
        <a onclick="gotoCommentPage(@Model.SongId, @Model.PagingControl.NextPageNumber)" class="buttonClass">Next</a>
        <a onclick="gotoCommentPage(@Model.SongId, @Model.TotalPageCount)" class="buttonClass">Last</a>
    }
</div>
<div align="center">
    @if (Request.IsAuthenticated)
    {
        <div align="right" style="margin-top: 10px;">
            <div class="titleSection">
                <span class="titleTab">Leave a comment </span>
                <img src="@Url.Content("~/Content/Images/writecomment.png")" width="20" height="20"/>
            </div>
        </div>
        <textarea class="textAreaComment" id="newCommentArea"></textarea>
        <a onclick="postComment(@Model.SongId)" class="buttonClass">Post my comment</a>
    }
    else
    {
        <text> You must login to leave comment...</text>
    }
    <div class="center">
        <img id="loaderIndicator" src="@Url.Content("~/Content/Images/loader.gif")" />
        <br /><span id="errorMessage"></span>
    </div>
</div>

